@extends('layouts.userctl')
@section('content')
<style>
	.formpage {
		width: 60%;
		height: auto;
		margin: 10px auto;
	}
	.layui-form-label{
		width: 150px;
	}
	.layui-input-block{
		margin-left: 150px;
	}
</style>
<div class="formpage">
	<form class="layui-form" action="{{route('admin.user.useredit',['id'=>$user->id])}}" method="post" onkeypress="return event.keyCode != 13;">
		{{csrf_field()}} 
		<div class="layui-form-item">
			<label class="layui-form-label">姓名</label>
			<div class="layui-input-block">
				<input type="text" name="username" required lay-verify="required" placeholder="请输入用户姓名" autocomplete="off"
					class="layui-input" value="{{$user->name}}">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">身份证号</label>
			<div class="layui-input-block">
				<input type="text" name="id_card"  placeholder="请输入身份证号"
					autocomplete="off" class="layui-input" value="{{$user->idcard}}">  <!--required lay-verify="required"-->
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">手机号</label>
			<div class="layui-input-block">
				<input type="text" name="phone"  placeholder="请输入手机号"
					autocomplete="off" class="layui-input" value="{{$user->phone}}">  <!--required lay-verify="required"-->
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">性别</label>
			<div class="layui-input-block">
				<input type="radio" name="sex" value="男" title="男" {{$user->sex=="男"?'checked':''}} >
				<input type="radio" name="sex" value="女" title="女" {{$user->sex=="女"?'checked':''}}>
			</div>
		</div>
		<div class="layui-form-item">
		    <label class="layui-form-label">部门</label>
		    <div class="layui-input-block">
		      <select name="department_id" id="depdiv">
		        <option value="0">无</option>
				@foreach($deps as $dep)
		        <option value="{{$dep->id}}">{{$dep->department}}</option>
		        @endforeach
		      </select>
		    </div>
		</div>
		<div class="layui-form-item">
		    <label class="layui-form-label">岗位</label>
		    <div class="layui-input-block">
		      <select name="job_id" id="jobdiv">
		        <option value="0">无</option>
				@foreach($jobs as $job)
		        <option value="{{$job->id}}">{{$job->job}}</option>
		        @endforeach
		      </select>
		    </div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">所属地区</label>
			<div class="layui-input-block" style="display: flex;flex-direction: row;">
				<div class="layui-input-inline" style="flex: 1;">
					<select name="province"  lay-filter="provincediv" id="provincediv"
						lay-search>
						<option value="">请选择省份</option>
						@foreach($provinces as $p)
						<option value="{{$p['id']}}">{{$p['name']}}</option>
						@endforeach
					</select>
				</div>
				<div class="layui-input-inline" style="flex: 1;">
					<select name="city"  lay-filter="citydiv" id="citydiv"
						lay-search>
						<option value="">请选择市</option>
						@foreach($citys as $p)
						<option value="{{$p['id']}}">{{$p['name']}}</option>
						@endforeach
					</select>
				</div>
				<div class="layui-input-inline" style="flex: 1;">
					<select name="district"  lay-filter="districtdiv"
						id="districtdiv" lay-search>
						<option value="">请选择县/区</option>
						@foreach($districts as $p)
						<option value="{{$p['id']}}">{{$p['name']}}</option>
						@endforeach
					</select>
				</div>
				<div class="layui-input-inline" style="flex: 1.5;margin-right: 0;">
					<select name="street"  lay-filter="streetdiv"
						id="streetdiv" lay-search>
						<option value="">请选择镇/街道</option>
						@foreach($streets as $p)
						<option value="{{$p['id']}}">{{$p['name']}}</option>
						@endforeach
					</select>
				</div>
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">所属社区</label>
			<div class="layui-input-block">
				<select name="community"  lay-filter="communitydiv"
					id="communitydiv" lay-search>
					<option value="">请选择社区</option>
					@foreach($communitys as $p)
					<option value="{{$p['id']}}">{{$p['name']}}</option>
					@endforeach
				</select>
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">上午上班时间</label>
			<div class="layui-input-block">
				<input type="text" class="layui-input" id="mwork" name="mwork" style="width: 200px;">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">上午下班时间</label>
			<div class="layui-input-block">
				<input type="text" class="layui-input" id="moffwork" name="moffwork" style="width: 200px;">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">下午上班时间</label>
			<div class="layui-input-block">
				<input type="text" class="layui-input" id="awork" name="awork" style="width: 200px;">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">下午下班时间</label>
			<div class="layui-input-block">
				<input type="text" class="layui-input" id="aoffwork" name="aoffwork" style="width: 200px;">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">职责描述</label>
			<div class="layui-input-block">
				<input type="text" name="duty" placeholder="请填写职责描述" autocomplete="off"
					class="layui-input" value="{{$user->duty}}">  <!--required lay-verify="required"-->
			</div>
		</div>
		<!-- <div class="layui-form-item">
			<label class="layui-form-label">身份证号</label>
			<div class="layui-input-block">
				<input type="text" name="cardnum" required lay-verify="required" placeholder="请输入身份证号" autocomplete="off"
					class="layui-input" value="{{$user->cardnum}}">
			</div>
		</div> -->
		<div class="layui-form-item">
			<div class="layui-input-block">
				<button class="layui-btn layui-btn-normal" lay-submit lay-filter="formDemo">立即提交</button>
				<a href="{{ url()->previous()}}" class="layui-btn layui-btn-primary" id="backpage">返  回</a>
			</div>
		</div>
	</form>
</div>
<script>
	//Demo
layui.use('form', function() {
	var form = layui.form
	var laydate = layui.laydate
	
	$('#depdiv').val('{{$user->department_id}}')
	$('#jobdiv').val({{$user->job_id}})
	form.render(); 
	
	$('#backpage').click(function() {
		history.back(-1)
	})
	laydate.render({
		elem: '#mwork' ,//指定元素
		type: 'time',
		format: 'H:mm',
		value:"{{$user->mwork?$user->mwork:'9:00'}}"
	})
	laydate.render({
		elem: '#moffwork' ,//指定元素
		type: 'time',
		format: 'H:mm',
		value:"{{$user->moffwork?$user->moffwork:'12:00'}}"
	})
	laydate.render({
		elem: '#awork' ,//指定元素
		type: 'time',
		format: 'H:mm',
		value:"{{$user->awork?$user->awork:'14:00'}}"
	})
	laydate.render({
		elem: '#aoffwork' ,//指定元素
		type: 'time',
		format: 'H:mm',
		value:"{{$user->aoffwork?$user->aoffwork:'17:30'}}"
	})
	
	
	$('#provincediv').val({{$user->province}})
	$('#citydiv').val({{$user->city}})
	$('#districtdiv').val({{$user->district}})
	$('#streetdiv').val({{$user->street}})
	$('#communitydiv').val({{$user->community}})
	form.render(); 
	//======================2级菜单===================
	form.on('select(provincediv)', function(data) {
		var name = data.elem.selectedOptions[0].text
		var code = data.value
		var s = '<option value="">请选择市</option>'
		if (name == '') {
			$('#citydiv').html(s)
			form.render('select')
		} else {
			$.ajax({
				type: 'POST', //提交方式
				headers: { 'X-CSRF-TOKEN': $('input[name="_token"]').val() },
				data: { lvl: 2, code },
				url: '/admin/area/getjson',
				success: function(result) {
					var list = result.data
					$.each(list, function(i, arr) {
						s = s + '<option value="' + arr.id + '">' +
							arr.name + '</option>'
					})
					$('#citydiv').html(s)
					form.render('select')
				}
			})
		}
		$('#districtdiv').html('<option value="">请选择县/区</option>')
		$('#streetdiv').html('<option value="">请选择镇/街道</option>')
		$('#communitydiv').html('<option value="">请选择社区</option>')
		form.render('select')
	})
	
	//======================3级菜单===================
	form.on('select(citydiv)', function(data) {
		var name = data.elem.selectedOptions[0].text
		var code = data.value
		var s = '<option value="">请选择县/区</option>'
		if (name == '') {
			$('#districtdiv').html(s)
			form.render('select')
		} else {
			$.ajax({
				type: 'POST', //提交方式
				headers: { 'X-CSRF-TOKEN': $('input[name="_token"]').val() },
				data: { lvl: 3, code },
				url: '/admin/area/getjson',
				success: function(result) {
					var list = result.data
					// console.log(result);
					$.each(list, function(i, arr) {
						s = s + '<option value="' + arr.id + '">' +
							arr.name + '</option>'
					})
					$('#districtdiv').html(s)
					form.render('select')
				}
			})
		}
		$('#streetdiv').html('<option value="">请选择镇/街道</option>')
		$('#communitydiv').html('<option value="">请选择社区</option>')
		form.render('select')
	})
	
	//======================4级菜单===================
	form.on('select(districtdiv)', function(data) {
		var name = data.elem.selectedOptions[0].text
		var code = data.value
		var s = '<option value="">请选择镇/街道</option>'
		if (name == '') {
			$('#streetdiv').html(s)
			form.render('select')
		} else {
			$.ajax({
				type: 'POST', //提交方式
				headers: { 'X-CSRF-TOKEN': $('input[name="_token"]').val() },
				data: { lvl: 4, code },
				url: '/admin/area/getjson',
				success: function(result) {
					var list = result.data
				$.each(list, function(i, arr) {
						s = s + '<option value="' + arr.id + '">' +
							arr.name + '</option>'
					})
					$('#streetdiv').html(s)
					form.render('select')
				}
			})
		}
		$('#communitydiv').html('<option value="">请选择社区</option>')
		form.render('select')
	})
	//======================5级菜单===================
	form.on('select(streetdiv)', function(data) {
		var name = data.elem.selectedOptions[0].text
		var code = data.value
		var s = '<option value="">请选择社区</option>'
		if (name == '') {
			$('#communitydiv').html(s)
			form.render('select')
		} else {
			$.ajax({
				type: 'POST', //提交方式
				headers: { 'X-CSRF-TOKEN': $('input[name="_token"]').val() },
				data: { lvl: 5, code },
				url: '/admin/area/getjson',
				success: function(result) {
					var list = result.data
					$.each(list, function(i, arr) {
						s = s + '<option value="' + arr.id + '">' +
							arr.name + '</option>'
					})
					$('#communitydiv').html(s)
					form.render('select')
				}
			})
		}
		
		form.render('select')
	})
	//======================6级菜单===================
	
	//监听提交
	form.on('submit(formDemo)', function(data) {
		var index = layer.load(0, { shade:false })
	})
})
</script>

@endsection
